<template>
    <section class="header" v-if="isShow">
        <img class="back"  src="../assets/img/icon_back.png" alt="后退" @click="handleBack">
        <img v-if="isCloseShow"  class="close" src="../assets/img/icon_close.png" alt="关闭" @click="handleClose()">
    </section>
</template>

<script lang="ts">
    import {Component, Vue, Prop} from 'vue-property-decorator';

    @Component
    export default class  MyHeader extends Vue {
        private isShow:Boolean = false;

        @Prop({ type: Boolean, default: false})
        isCloseShow:any

        @Prop({ type: Object, default: null})
        backParam:any


        mounted(){
            //检测是否是APP打开
        }

        handleBack():void{
            if (this.backParam != null) {
                this.$router.push({
                    path: '/home',
                    query:this.backParam
                })
            }else{
                this.$router.go(-1)
            }
        }

        handleClose():void{
            this.$router.push({
                path: '/home',
            })
        }
    }
</script>

<style scoped lang="scss">
    .header{
        padding: 54px 15px 0 15px;
        height: 30px;
        background: rgba(0,0,0,0);

        img{
            width: 16px;
            height: 26px;
            &:not(:first-child){
                margin-left: 16px;
            }
        }

        .close{
          width: 26px;
          height: 26px;
        }
    }
</style>